<template>
  <div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>资产环境管理</el-breadcrumb-item>
      <el-breadcrumb-item>ECS信息</el-breadcrumb-item>
    </el-breadcrumb>
    <el-card class="box-card">
      <el-table :data="tableData"
                style="width: 100%;
                margin-top: -10px;line-height: 70px;"
      >
        <el-table-column prop="InstanceName" label="主机名称">
        </el-table-column>
        <el-table-column prop="InstanceId" label="主机ID">
        </el-table-column>
        <el-table-column prop="InstanceIp" label="主机IP">
        </el-table-column>
        <el-table-column prop="InstanceCpu" label="CPU">
        </el-table-column>
        <el-table-column prop="InstanceMemory" label="MEMORY">
        </el-table-column>
      </el-table>
    </el-card>
  </div>
</template>

<script>
  import { getMoment } from '../utils/timeFilter'
  import axios from 'axios'
  export default {
    filters: {
      getMoment
    },
    data: function () {
      return {
        tableData: []
      }
    },
    mounted () {
      this.loadData()
    },
    methods: {
      loadData: function () {
        axios.get(`${this.cmdbUrl}/Ecsinfo`).then(
          response => {
            this.tableData = response.data.data
          })
      }
    }
  }
</script>

<style>
  .box-card {
    width: 100%;
    margin-top: 10px;
  }
</style>
